<link href="//cdn.bootcss.com/weui/1.1.2/style/weui.min.css" rel="stylesheet">
<script src="//cdn.bootcss.com/vue/2.4.2/vue.min.js"></script>
<style>
    .weui-panel{
        background: #ededed;
    }
    .weui-panel__bd{
        margin-top:5px;
        background: #fff;
    }
</style>
<div id='app'>
    <div class="page__bd">
        <div class="weui-panel weui-panel_access">
            <div class="weui-panel__hd" style="background: #fff;">下级订单</div>
                <template v-for="item in list">
                    <div class="weui-panel__bd">
                        <a class="weui-cell weui-cell_access">
                            <div class="weui-cell__bd weui-cell_primary">
                                <h4 class="weui-media-box__title">创建时间：{{item.create_time}}</h4>
                                <p class="weui-media-box__desc"> </p>
                            </div>
                        </a>
                        <a class="weui-cell weui-cell_access">
                            <div class="weui-cell__bd weui-cell_primary">
                                <h4 class="weui-media-box__title">付款时间：{{item.pay_time}}</h4>
                                <p class="weui-media-box__desc"> </p>
                            </div>
                        </a>
                        <a class="weui-cell weui-cell_access">
                            <div class="weui-cell__bd weui-cell_primary">
                                <h4 class="weui-media-box__title">订单：{{item.order_title}}</h4>
                                <p class="weui-media-box__desc"> </p>
                            </div>
                        </a>
                        <a class="weui-cell weui-cell_access">
                            <div class="weui-cell__bd weui-cell_primary">
                                <h4 class="weui-media-box__title">下单人：{{item.realname}} ID：{{item.uid}}</h4>
                                <p class="weui-media-box__desc"> </p>
                            </div>
                        </a>
                        <a class="weui-cell weui-cell_access">
                            <div class="weui-cell__bd weui-cell_primary">
                                <h4 class="weui-media-box__title">金额：{{item.order_cashmoney}}</h4>
                                <p class="weui-media-box__desc"> </p>
                            </div>
                        </a>
                         <a class="weui-cell weui-cell_access">
                            <div class="weui-cell__bd weui-cell_primary">
                                <h4 class="weui-media-box__title">收货地址：</h4>
                                <p class="weui-media-box__desc">
                                    {{item.delivery.delivery_name}}{{item.delivery.delivery_mobile}},
                                    {{item.delivery.province}}{{item.delivery.city}}{{item.delivery.county}},
                                    {{item.delivery.address}}
                                </p>
                            </div>
                        </a>
                    </div>
                </template>
            </div>
            <div 
                v-if="!empty"
                style="background:#fff;"
                class="weui-panel__ft">
                <a  
                    @click="getMore()"
                    class="weui-cell weui-cell_access weui-cell_link">
                    <div class="weui-cell__bd">查看更多</div>
                    <span class="weui-cell__ft"></span>
                </a>    
            </div>
        </div>
    </div>
</div>
<include file="Common:nav" />
<script>
    var app = new Vue({
        el: '#app',
        data: {
            empty: true,
            list: [],
            page: 1
        },
        created: function () {
            this.getMore();
        },
        methods: {
            getMore: function () {
                var self = this;
                $.ajax({
                    type: 'get',
                    url: '/mobile/user/dailiorder?uid=<?=get("uid")?>&p=' + self.page,
                    success: function (res) {
                        layer.closeAll();
                        self.page++;
                        if(!res.data || res.data.length==0) {
                            self.empty = true;
                            return false;
                        }
                        if(res.data.length>0) {
                            for(var i=0;i<res.data.length;i++) {
                                self.list.push(res.data[i]);
                            }
                            self.empty = false;
                        }
                    },
                    beforeSend:function () {
                        layer.open({
                            type: 2,
                            content: '加载中'
                        })
                    }
                })
            }
        }
    })
</script>